import React, {PureComponent} from 'react';
import {Table, Card} from 'antd';
import PropTypes from 'prop-types';
import {
    TABLE,
    COMMON_TABLE_QUERY_FAIL_TEXT,
    COMMON_TABLE_EMPTY_TEXT} from '../constants';
import {formatAmount} from '../utils';
import TablePanelType from './TablePanelType';
import TablePanelRate from './TablePanelRate';
export class TablePanel extends PureComponent {
    state = {
        loading: false
    };
    handleAbandon = id => {
        this.setState({
            loading: true
        });
        this.props.onClickAbandon(id).then(() => {
            this.setState({
                loading: false
            });
        });
    };
    render() {
        const {formatMessage} = this.props.intl;
        const columns = [{
            title: formatMessage({
                id: 'tablePanel.column.month',
                defaultMessage: '日期'
            }),
            dataIndex: 'month'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.country',
                defaultMessage: '国家'
            }),
            dataIndex: 'country'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.dealerCode',
                defaultMessage: '总代'
            }),
            dataIndex: 'dealerCode'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.partVariety',
                defaultMessage: '备件品种数'
            }),
            dataIndex: 'partVariety'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.stockVariety',
                defaultMessage: '库存品种数'
            }),
            dataIndex: 'stockVariety'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.saleVariety',
                defaultMessage: '销售品种数'
            }),
            dataIndex: 'saleVariety'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.stockAmount',
                defaultMessage: '库存金额'
            }),
            dataIndex: 'stockAmount',
            render: text => formatAmount(text)
        }, {
            title: formatMessage({
                id: 'tablePanel.column.saleAmount',
                defaultMessage: '销售金额'
            }),
            dataIndex: 'saleAmount',
            render: text => formatAmount(text)
        }, {
            title: formatMessage({
                id: 'tablePanel.column.stockSaleRatio',
                defaultMessage: '存销比'
            }),
            dataIndex: 'stockSaleRatio'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.sluggishVariety',
                defaultMessage: '呆滞品种数'
            }),
            dataIndex: 'sluggishVariety'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.sluggishAmount',
                defaultMessage: '呆滞金额'
            }),
            dataIndex: 'sluggishAmount',
            render: text => formatAmount(text)
        }, {
            title: formatMessage({
                id: 'tablePanel.column.stockOverVariety',
                defaultMessage: '超储品种数'
            }),
            dataIndex: 'stockOverVariety'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.stockOverAmount',
                defaultMessage: '超储金额'
            }),
            dataIndex: 'stockOverAmount',
            render: text => formatAmount(text)
        }, {
            title: formatMessage({
                id: 'tablePanel.column.submitSluggishVariety',
                defaultMessage: '总代提报呆滞品种'
            }),
            dataIndex: 'submitSluggishVariety'
        }, {
            title: formatMessage({
                id: 'tablePanel.column.submitSluggishAmount',
                defaultMessage: '总代提报呆滞金额'
            }),
            dataIndex: 'submitSluggishAmount'
        }];
        const locale = {
            emptyText: this.props.hasError ? COMMON_TABLE_QUERY_FAIL_TEXT : COMMON_TABLE_EMPTY_TEXT
        };
        return (
            <Card>
                <Table
                    className="white-space-nowrap"
                    columns={columns}
                    dataSource={this.props.data}
                    rowKey="id"
                    pagination={false}
                    loading={this.props.loading || this.state.loading}
                    locale={locale}
                    {...TABLE}/>
                <TablePanelType/>
                <TablePanelRate/>
            </Card>
        );
    }
}

TablePanel.propTypes = {
    data: PropTypes.array.isRequired,
    hasError: PropTypes.string.isRequired,
    loading: PropTypes.bool.isRequired,
    intl: PropTypes.object,
};
import selectorFactory from 'Shared/utils/immutableToJsSelectorFactory';
const getData = selectorFactory(['page', 'domainData', 'list', 'data']);
const mapStateToProps = state => ({
    data: getData(state),
    loading: state.getIn(['page', 'domainData', 'list', 'isFetching']),
    hasError: state.getIn(['page', 'domainData', 'list', 'hasError']),
});

import {connect} from 'react-redux';
import {injectIntl} from './intl';
export default connect(mapStateToProps, null)(injectIntl(TablePanel));
